<script lang="ts" setup>
import { ref, computed, watch, onMounted, reactive, PropType } from 'vue';
import { IconCaretDown } from '@arco-design/web-vue/es/icon';
import API from '@/services';
const props = defineProps({
    modelValue:{
        type: Object as PropType<any>
    }
})
const priorityOptions= ref<defs.DemandEnumDTO[]>()

const getLevel = async () => {
    const res = await API.enumBao.getDemandLevelEnum({})
    if (res.code === 200) {
        priorityOptions.value = res.data
    }
}
const formRef :any = ref()

const publishFormValids = () => {
    return formRef.value.validate()
}
const resetField = () => {
    formRef.value.resetFields()
} 
defineExpose({
    publishFormValids,
    resetField
})
onMounted(() => {
    getLevel()
})
</script>


<template>
    <a-form 
        :model="props.modelValue" 
        ref="formRef"
        auto-label-width
    >
    <a-form-item 
        show-colon
        required
        field="demandName"
        label="需求名称"
        :rules="[{required:true,message:'请输入需求名称'}]"
    >
        <a-input 
        v-model="props.modelValue.demandName" 
        placeholder="请输入"
        />
    </a-form-item>
    <a-form-item 
        show-colon
        field="priorityLevel"
        label="优先级"
        required
        :rules="[{required:true,message:'请选择优先级'}]"
    >
        <a-select 
            v-model="props.modelValue.priorityLevel" 
            placeholder="请选择"
            :style="{width: '270px'}"
        >
            <template #arrow-icon>
                <icon-caret-down />
            </template>
            <a-option 
                v-for="item of priorityOptions" 
                :label="item.value" 
                :value="item.key">
                
            </a-option>
        </a-select>
    </a-form-item>
    <a-form-item 
        show-colon
        field="description"
        label="需求描述"
    >
        <a-textarea 
            v-model="props.modelValue.description" 
            placeholder="请输入"
        />
    </a-form-item>
    </a-form>

</template>

<style lang="scss" scoped></style>